<!DOCTYPE html>

  <!--[if lt IE 7]>
    <html class="lt-ie9 lt-ie8 lt-ie7" lang="en">
  <![endif]-->

  <!--[if IE 7]>
    <html class="lt-ie9 lt-ie8" lang="en">
  <![endif]-->

  <!--[if IE 8]>
    <html class="lt-ie9" lang="en">
  <![endif]-->

  <!--[if gt IE 8]>
    <!-->
    <html lang="en">
    <!--
  <![endif]-->

  <head>
    <meta charset="utf-8">
    <title>Slick Admin</title>
    <meta name="author" content="John">
    <meta content="width=device-width, initial-scale=1.0, user-scalable=no" name="viewport">
    <meta name="description" content="Slick Admin Admin UI">
    <meta name="keywords" content="Slick Admin, Admin UI, Admin Dashboard, John">
    
    <script src="js/html5-trunk.js"></script>
    
    <link href="css/style.css" rel="stylesheet">
    <!--[if lte IE 7]>
    <script src="js/lte-ie7.js"></script>
    <![endif]-->

    <!-- bootstrap css -->
    <link href="css/bootstrap.css" rel="stylesheet">

    <!-- custom css -->
    <link href="css/main.css" rel="stylesheet">

  </head>

  <body>
    
   


    <!-- Main Container start -->
    <div class="main-container">

   

      <!-- Dashboard wrapper start -->
      <div class="dashboard-wrapper">

       
          

        
   
        <!-- Row start -->
        <div class="row">
          <div class="col-md-12">
            <div class="widget">
              <div class="widget-header">
                <div class="title">
                  <span class="fs1" aria-hidden="true" data-icon="&#xe14a;"></span> Data Table
                </div>
              </div>
              <div class="widget-body">
                <div id="dt_example" class="example_alt_pagination">
                  <table class="table table-condensed table-striped table-hover table-bordered pull-left" id="data-table">    
                    <thead>
                      <tr>
                        <th style="width:25%">Buyers Name</th>
                        <th style="width:35%">Address</th>
                        <th style="width:15%" class="hidden-phone">Contact</th>
                        <th style="width:15%" class="hidden-phone">Due Amount</th>
                        <th style="width:10%" class="hidden-phone">Actions</th>
                      </tr>
                    </thead>
                    <tbody>
                      <tr class="gradeX">
                        <td>John</td>
                        <td>Tacoma, WA(Washington)</td>
                        <td class="hidden-phone">0099009900</td>
                        <td class="hidden-phone">$22590</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            查看详情
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeA">
                        <td>Ruchita</td>
                        <td>Fresno, CA 93711-1005</td>
                        <td class="hidden-phone">0006008800</td>
                        <td class="hidden-phone">$98450</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeU">
                        <td>Barote babu</td>
                        <td>Baripoda, 35-Africa</td>
                        <td class="hidden-phone">2059990099</td>
                        <td class="hidden-phone">$99876</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeC">
                        <td>Arjun Aurs</td>
                        <td>395 - Yumi Street, London</td>
                        <td class="hidden-phone">0088770099</td>
                        <td class="hidden-phone">$44550</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeA">
                        <td>Tom Maskerre</td>
                        <td>Brigade road - Africa</td>
                        <td class="hidden-phone">1002001000</td>
                        <td class="hidden-phone">$9992</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeX">
                        <td>Maitai Mui</td>
                        <td>24- Chingcgang - China</td>
                        <td class="hidden-phone">0011001100</td>
                        <td class="hidden-phone">$44560</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeU">
                        <td>Himresh Mayi</td>
                        <td>Anniston, AL 36207-1211</td>
                        <td class="hidden-phone">0000002200</td>
                        <td class="hidden-phone">$88790</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeU">
                        <td>Gajju Marnison</td>
                        <td>Downingtown, PA 1133-1209</td>
                        <td class="hidden-phone">1234321678</td>
                        <td class="hidden-phone">$9908</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeA">
                        <td>Powell Pack</td>
                        <td>South Orange, NJ</td>
                        <td class="hidden-phone">1123889911</td>
                        <td class="hidden-phone">$77651</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeU">
                        <td>Kinsin Mane</td>
                        <td>Dublin, OH 13019-8579</td>
                        <td class="hidden-phone">1919189191</td>
                        <td class="hidden-phone">$22189</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeU">
                        <td>Barote babu</td>
                        <td>Baripoda, 35-Africa</td>
                        <td class="hidden-phone">2059990099</td>
                        <td class="hidden-phone">$99876</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeA">
                        <td>Tom Maskerre</td>
                        <td>Brigade road - Africa</td>
                        <td class="hidden-phone">1002001000</td>
                        <td class="hidden-phone">$9992</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeX">
                        <td>Maitai Mui</td>
                        <td>24- Chingcgang - China</td>
                        <td class="hidden-phone">0011001100</td>
                        <td class="hidden-phone">$44560</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeU">
                        <td>Himresh Mayi</td>
                        <td>Anniston, AL 36207-1211</td>
                        <td class="hidden-phone">0000002200</td>
                        <td class="hidden-phone">$88790</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeU">
                        <td>Gajju Marnison</td>
                        <td>Downingtown, PA 1133-1209</td>
                        <td class="hidden-phone">1234321678</td>
                        <td class="hidden-phone">$9908</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash">
                          </a>
                        </td>
                      </tr>
                      <tr class="gradeA">
                        <td>Powell Pack</td>
                        <td>South Orange, NJ</td>
                        <td class="hidden-phone">1123889911</td>
                        <td class="hidden-phone">$77651</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                          <a href="#" class="delete-row" data-original-title="Delete">
                            <img src="img/trash-icon.png" alt="trash" >
                          </a>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                  <div class="clearfix"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- Row end -->

      

    

      </div>
      <!-- Dashboard wrapper end -->
    
    </div>
    <!-- Main Container end -->

    <!-- Scripts -->
    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.js"></script>
    <script src="js/jquery-ui-1.8.23.custom.min.js"></script>

    <!-- Easy pie charts -->
    <script src="js/jquery.easy-pie-chart.js"></script>

    <!-- Sparkline graphs -->
    <script src="js/jquery.sparkline.js"></script>

    <!-- Data tables -->
    <script src="js/jquery.dataTables.js"></script>

    <!-- Custom Js -->
    <script src="js/custom-tables.js"></script>

    <!-- custom Js -->
    <script src="js/custom.js"></script>


  </body>
</html>